<template>
  <div>
    <ul>
        <li>name:<input type="text" v-model="student.name" /></li>
        <li>age:<input type="text" v-model="student.age" /></li>
        <li>sex:<input type="text" v-model="student.sex" /></li>
    </ul>
    <button @click="submit">提交修改</button>
  </div>
</template>

<script>
import {mapState,mapMutations} from "vuex" 

export default {
  data() {
    return {
        student:{
            name: this.name,
            age: this.age,
            sex: this.sex
        }
    }
  },
    computed:{
    ...mapState('student',['name','age','sex'])
    },
    methods:{
        ...mapMutations('student',{setName:'setName',setAge:'setAge',setSex:'setSex'}),
        submit(){
            this.setName(this.student.name)
            this.setAge(this.student.age)
            this.setSex(this.student.sex)
        }
    },
    mounted(){
        this.student.name=this.name
        this.student.age=this.age
        this.student.sex=this.sex
    }
}
</script>

<style>

</style>